<template>
  <div class="">
    <div class=""> 
      <van-field v-model="currentDate" label="开始日期" placeholder="请选择日期" @click="showDatePicker" />
      <van-action-sheet v-model:show="datePickerShow" :closeable="false" title="选择日期">
        <van-date-picker v-model="seledDate" @confirm="setDate" @cancel="resetDate" />
      </van-action-sheet>
    </div>
    <loader :loadShow="loadShow" />
  </div>
</template>

<script setup>
import { ref, onMounted } from 'vue'
import { sessionApi } from '@/commons/api'
import routes from '@/commons/router'
import Msg from '@/components/message'
import Loader from '@/components/loader/Loader.vue'

// 挂载前判断用户是否登录，如果已登录，则直接跳转到主页
onMounted(() => {
  // hasLogin()
})

// 定义是否显示加载中的变量
let loadShow = ref(false)

// hasLogin 判断用户是否已经登录，如果已登录，则直接跳转到主页
const hasLogin = async () => {
  loadShow.value = true
  const res = await sessionApi()
  if(res.code === 200) {
    
  } else {
    localStorage.removeItem('token')
    Msg({ kind: 'error', txt: res.msg })
    routes.replace({path: '/'})
  }
  loadShow.value = false
}

// showDatePicker 显示日期选择器
const currentDate = ref('')
const datePickerShow = ref(false)
const showDatePicker = () => {
  datePickerShow.value = true
}
const seledDate = ref([])
const setDate = ({ selectedValues }) => {
  loadShow.value = true
  currentDate.value = selectedValues.join('-')
  datePickerShow.value = false
  setTimeout(() => {
    loadShow.value = false
  }, 1000)
}
const resetDate = () => {
  currentDate.value = ''
  datePickerShow.value = false
}
</script>

<style scoped>

</style>